import {Tween, Easing} from 'https://unpkg.com/@tweenjs/tween.js@23.1.3/dist/tween.esm.js'

var isScrolling_X = false;
var touchRecord_X = [];
var isScrolling_Y = false;
var touchRecord_Y = [];

function isSameSymbol(x1, x2) {
	if (((x1 > 0) && (x2 > 0)) || ((x1 < 0) && (x2 < 0)) || ((x1 == 0) && (x2 == 0))) {
		return true;
	} else {
		return false;
	}
}

$(document).ready(function() {

	// 禁用全部的滑动
	document.body.addEventListener('touchmove', function(e) {
		e.preventDefault();
	} , { passive : false } );

	$(".scroll-x").on("touchstart", e => {
		isScrolling_X = false;
		touchRecord_X = [];
		touchRecord_X.push([e.touches[0].clientX, Date.now()])
	}).on("touchmove", e => {
		const touch_X = e.touches[0].clientX;
		const offset = touch_X - touchRecord_X[touchRecord_X.length-1][0];
		e.currentTarget.scrollLeft -= offset;
		touchRecord_X.push([touch_X, Date.now()])
	}).on("touchend", e => {
		touchRecord_X[touchRecord_X.length-1][1] = Date.now();
		if (touchRecord_X.length > 1) {  // 不是只点击了一下
			// 获取最终的单调区间
			var new_touchRecord_X = [];
			var l = touchRecord_X.length
			var direct = (touchRecord_X[l-1][0] - touchRecord_X[l-2][0] > 0) ? 1 : -1;
			var last = null
			for (var i = l-1; i >= 0; i--) {
				if (last) {
					var offset = touchRecord_X[i][0] - last;
					if (isSameSymbol(offset, direct)) {
						break;
					}
					last = touchRecord_X[i][0];
				} else {
					last = touchRecord_X[i][0];
				}
				new_touchRecord_X.unshift(touchRecord_X[i]);
			}
			touchRecord_X = new_touchRecord_X;

			// 获取最后一秒内移动的
			if (touchRecord_X.length > 1) {
				var lasting = 100;
				new_touchRecord_X = [];
				var startTime = false;
				for (var i = touchRecord_X.length-1; i >= 0; i--) {
					if (startTime != false) {
						if (startTime - touchRecord_X[i][1] < lasting) {
							new_touchRecord_X.push(touchRecord_X[i]);
						} else {
							break;
						}
					} else {
						startTime = touchRecord_X[i][1];
						new_touchRecord_X.push(touchRecord_X[i]);
					}
				}
				const s = new_touchRecord_X[0][0] - new_touchRecord_X[new_touchRecord_X.length-1][0];
				const v = s / lasting * 1000;   // 速度 *px/s

				// 速度大于一定值，滑动
				if (Math.abs(v) >= 150) {
					isScrolling_X = true;
					const coords = {x: e.currentTarget.scrollLeft, y: 0}
					var tween = new Tween(coords)
						.to({x: e.currentTarget.scrollLeft - v*0.8, y: 0}, 1500 )
						.easing(Easing.Quadratic.Out)
						.onUpdate(() => {
							if (isScrolling_X) {
								e.currentTarget.scrollLeft = coords.x
							}
						})
						.start() // Start the tween immediately.

					// Setup the animation loop.
					function animate() {
						requestAnimationFrame(animate)
						tween.update()
					}
					animate();
				}
			}
		}
	})

	$(".scroll-y").on("touchstart", e => {
		isScrolling_Y = false;
		touchRecord_Y = [];
		touchRecord_Y.push([e.touches[0].clientY, Date.now()])
	}).on("touchmove", e => {
		const touch_Y = e.touches[0].clientY;
		const offset = touch_Y - touchRecord_Y[touchRecord_Y.length-1][0];
		e.currentTarget.scrollTop -= offset;
		touchRecord_Y.push([touch_Y, Date.now()])
	}).on("touchend", e => {
		touchRecord_Y[touchRecord_Y.length-1][1] = Date.now();
		if (touchRecord_Y.length > 1) {  // 不是只点击了一下
			// 获取最终的单调区间
			var new_touchRecord_Y = [];
			var l = touchRecord_Y.length
			var direct = (touchRecord_Y[l-1][0] - touchRecord_Y[l-2][0] > 0) ? 1 : -1;
			var last = null
			for (var i = l-1; i >= 0; i--) {
				if (last) {
					var offset = touchRecord_Y[i][0] - last;
					if (isSameSymbol(offset, direct)) {
						break;
					}
					last = touchRecord_Y[i][0];
				} else {
					last = touchRecord_Y[i][0];
				}
				new_touchRecord_Y.unshift(touchRecord_Y[i]);
			}
			touchRecord_Y = new_touchRecord_Y;

			// 获取最后一秒内移动的
			if (touchRecord_Y.length > 1) {
				var lasting = 100;
				new_touchRecord_Y = [];
				var startTime = false;
				for (var i = touchRecord_Y.length-1; i >= 0; i--) {
					if (startTime != false) {
						if (startTime - touchRecord_Y[i][1] < lasting) {
							new_touchRecord_Y.push(touchRecord_Y[i]);
						} else {
							break;
						}
					} else {
						startTime = touchRecord_Y[i][1];
						new_touchRecord_Y.push(touchRecord_Y[i]);
					}
				}
				const s = new_touchRecord_Y[0][0] - new_touchRecord_Y[new_touchRecord_Y.length-1][0];
				const v = s / lasting * 1000;   // 速度 *px/s

				// 速度大于一定值，滑动
				if (Math.abs(v) >= 150) {
					isScrolling_Y = true;
					const coords = {x: 0, y: e.currentTarget.scrollTop}
					var tween = new Tween(coords)
						.to({x: 0, y: e.currentTarget.scrollTop - v}, 1500 )
						.easing(Easing.Quadratic.Out)
						.onUpdate(() => {
							if (isScrolling_Y) {
								e.currentTarget.scrollTop = coords.y
							}
						})
						.start() // Start the tween immediately.

					// Setup the animation loop.
					function animate() {
						requestAnimationFrame(animate)
						tween.update()
					}
					animate();
				}
			}
		}
	});

})